<div data-ng-controller="ClientTabCtrl">

    <h1 data-ng-show="create">{{:: 'add-client' | translate}}</h1>
    <h1 data-ng-hide="create">
        {{client.clientId|capitalize}}
        <i id="removeClient" class="pficon pficon-delete clickable" data-ng-show="client.access.manage" data-ng-click="removeClient()"></i>
    </h1>

    <ul class="nav nav-tabs"  data-ng-hide="create && !path[4]">
        <li ng-class="{active: !path[4]}"><a href="#/realms/{{realm.realm}}/clients/{{client.id}}">{{:: 'settings' | translate}}</a></li>
        <li ng-class="{active: path[4] == 'credentials'}"
            data-ng-show="!client.publicClient && client.protocol == 'openid-connect' && !client.origin">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/credentials">{{:: 'credentials' | translate}}</a>
        </li>
        <li ng-class="{active: path[4] == 'saml'}" data-ng-show="client.protocol == 'saml' && (client.attributes['saml.client.signature'] == 'true' || client.attributes['saml.encrypt'] == 'true')"><a href="#/realms/{{realm.realm}}/clients/{{client.id}}/saml/keys">{{:: 'keys' | translate}}</a></li>
        <li ng-class="{active: path[4] == 'oidc'}" data-ng-show="client.protocol == 'openid-connect'"><a
            href="#/realms/{{realm.realm}}/clients/{{client.id}}/oidc/keys">{{:: 'keys' | translate}}</a></li>
        <li ng-class="{active: path[4] == 'roles'}" data-ng-show="!client.origin"><a href="#/realms/{{realm.realm}}/clients/{{client.id}}/roles">{{:: 'roles' | translate}}</a></li>
        <li ng-class="{active: path[4] == 'client-scopes'}" data-ng-show="!client.bearerOnly">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/client-scopes/setup-scopes">{{:: 'client-scopes' | translate}}</a>
            <kc-tooltip>{{:: 'client-scopes.tooltip' | translate}}</kc-tooltip>
        </li>
        <li ng-class="{active: path[4] == 'mappers'}" data-ng-show="!client.bearerOnly">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/mappers">{{:: 'mappers' | translate}}</a>
            <kc-tooltip>{{:: 'mappers.tooltip' | translate}}</kc-tooltip>
        </li>
        <li ng-class="{active: path[4] == 'scope-mappings'}" data-ng-show="!client.bearerOnly">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/scope-mappings">{{:: 'scope' | translate}}</a>
            <kc-tooltip>{{:: 'scope.tooltip' | translate}}</kc-tooltip>
        </li>
        <li ng-class="{active: path[4] == 'authz'}"
            data-ng-show="!disableAuthorizationTab && client.authorizationServicesEnabled && !client.origin">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/authz/resource-server">{{:: 'authz-authorization' |
                translate}}</a></li>
        <li ng-class="{active: path[4] == 'revocation'}" data-ng-show="client.protocol != 'docker-v2' && client.protocol != 'saml' && !client.origin"><a
                href="#/realms/{{realm.realm}}/clients/{{client.id}}/revocation">{{:: 'revocation' | translate}}</a>
        </li>
    <!--    <li ng-class="{active: path[4] == 'identity-provider'}" data-ng-show="realm.identityFederationEnabled"><a href="#/realms/{{realm.realm}}/clients/{{client.id}}/identity-provider">Identity Provider</a></li> -->
        <li ng-class="{active: path[4] == 'sessions'}" data-ng-show="!client.bearerOnly">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/sessions">{{:: 'sessions' | translate}}</a>
            <kc-tooltip>{{:: 'sessions.tooltip' | translate}}</kc-tooltip>
        </li>

        <li ng-class="{active: path[4] == 'offline-access'}" data-ng-show="!client.bearerOnly">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/offline-access">{{:: 'offline-access' | translate}}</a>
            <kc-tooltip>{{:: 'offline-access.tooltip' | translate}}</kc-tooltip>
        </li>

        <li ng-class="{active: path[4] == 'clustering'}" data-ng-show="!client.publicClient && !client.origin"><a href="#/realms/{{realm.realm}}/clients/{{client.id}}/clustering">{{:: 'clustering' | translate}}</a></li>

        <li ng-class="{active: path[4] == 'installation'}" data-ng-show="!client.origin">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/installation">{{:: 'installation' | translate}}</a>
            <kc-tooltip>{{:: 'installation.tooltip' | translate}}</kc-tooltip>
        </li>

        <li ng-class="{active: path[4] == 'service-account-roles'}" data-ng-show="client.serviceAccountsEnabled && !(client.bearerOnly || client.publicClient)">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/service-account-roles">{{:: 'service-account-roles' | translate}}</a>
            <kc-tooltip>{{:: 'service-account-roles.tooltip' | translate}}</kc-tooltip>
        </li>
        <li ng-class="{active: path[4] == 'permissions'}" data-ng-show="serverInfo.featureEnabled('ADMIN_FINE_GRAINED_AUTHZ') && client.access.manage && access.manageAuthorization">
            <a href="#/realms/{{realm.realm}}/clients/{{client.id}}/permissions">{{:: 'authz-permissions' | translate}}</a>
            <kc-tooltip>{{:: 'manage-permissions-client.tooltip' | translate}}</kc-tooltip>
        </li>
    </ul>
</div>
